<template>
<div>
    <!-- <headerNavigation :jump="1"></headerNavigation> -->
    <labelNavigation :Xuexidata="semesterName"></labelNavigation>
    <button class="return" @click="back()">
    <i class="el-icon-arrow-left"></i>
     返回
  </button>
    <div class="background">
    <img  class="backgroundimg" src="@/assets/imagesbackground/Report.png" >
    <img class="imgreport" src="@/assets/images/StudentReport.png" >
    </div>
      <div class="name">
        <span>{{report['班级']}}</span>
        <span>{{report['学生姓名']}}</span>
      </div>
        <div class="height">
          <span>{{report['身高']}}</span>
          <span>{{report['体重']}}</span>
        </div>
        <div class="ear">
          <span class="leftear">{{report['左眼']}}</span>
          <span class="rightear">{{report['右眼']}}</span>
        </div>
      <div class="resport1">
        <div class="score">
          <span>{{score['语文']}}</span>
          <span>{{score['数学']}}</span>
          <span>{{score['英语']}}</span>
          <span>{{score['科学']}}</span>
        </div>
        <div class="score">
         <span>{{value['语文']}}</span>
         <span>{{value['数学']}}</span>
         <span>{{value['英语']}}</span>
         <span>{{value['科学']}}</span>
        </div>
      </div>

      <div class="resport2">
        <div class="assess">
           <span>{{value['道德与法']}}</span>
           <span>{{value['体育']}}</span>
        </div>
        <div class="assess">
          <span>{{value['音乐']}}</span>
          <span>{{value['信息']}}</span>
        </div>
        <div class="assess">
          <span>{{value['美术']}}</span>
          <span>{{value['综合实践']}}</span>
        </div>
      </div>
      <div class="showreport">
        <div class="allassesss">
          <span>{{value['听课专注']}}</span>
          <span>{{value['做事负责']}}</span>
        </div>
        <div class="allassesss">
         <span>{{value['学习主动']}}</span>
         <span>{{value['同学合作']}}</span>
        </div>
      </div>
      <div class="btnCountainer">
      <button class="btn" @click="next">下一模块</button>
      </div>
    <!-- <footerNavigation></footerNavigation> -->
</div>
</template>
<script>
import headerNavigation from "../components/background/headerNavigation"
import labelNavigation from "../components/background/labelNavigation"
import footerNavigation from "../components/background/footerNavigation"
import { studentbsogsoAPI} from '@/api/make/make'

export default {
    components:{
        // headerNavigation,
        labelNavigation,
        // footerNavigation
    },
    data() {
      return {
         studentId:'',
         growthId:'',
         report:[],
         score:[],
         value:[],
         semesterName:""
      };
    },
    methods: {
        next() {
        this.$router.push("/doGrowth/teacherword");
      },
        back() {
        this.$router.go(-1)
        },
    },
  mounted(){
     window.onbeforeunload = function (e) { 
    var storage = window.localStorage; 
    storage.clear() 
    }
  },
    async created() {
        //学期
        let semesterName=this.$route.query.semesterName
        console.log("33333",this.$route.query.semesterName)
        if(semesterName!=undefined){
        sessionStorage.setItem("semesterName",this.$route.query.semesterName)
        this.semesterName=sessionStorage.getItem("semesterName")
        }
        else{
        this.semesterName=sessionStorage.getItem("semesterName")
        }
        console.log(this.$route.params)
        let studentId=this.$route.params.stuId
        let growthId=this.$route.params.growthId
        if(studentId!=undefined){
          sessionStorage.setItem("studentId",this.$route.params.stuId)
          this.studentId=sessionStorage.getItem("studentId")
        }
        else{
          this.studentId=sessionStorage.getItem("studentId")
        }
        if(growthId!=undefined){
           sessionStorage.setItem("growthId",this.$route.params.growthId)
            this.growthId=sessionStorage.getItem("growthId")
        }else{
          this.growthId=sessionStorage.getItem("growthId")
        }
     const res=await studentbsogsoAPI({studentId:this.studentId,growthId:this.growthId})
     this.report=res.data["13"]
     this.score=res.data["13"].成绩
     this.value=res.data["13"].综合评价等第
     console.log("6666",this.report)
  },
  }
</script>

<style scoped>
.background{
  display: flex;
  margin-top: 3.125rem;
}

.backgroundimg{
  height: 33.6875rem;
  width: 23.875rem;
  z-index: 1;
  position: relative;
  margin: 0 auto;
}
.imgreport{
  position:absolute;
  z-index: 2;
  height: 28.125rem !important;
  width: 20.625rem !important;
  left: 50.1%; top: 53.5%;
  transform: translate(-50%, -50%);
}
/* 信息 */
.name{
  display: flex;
  z-index: 3;
  position:absolute;
  top: 35.5%;right: 48.7%;
  font-size: .75rem;
  width: 9.0625rem;
  justify-content: space-between;
}
.height{
  display: flex;
  z-index: 3;
  position:absolute;
  top: 37.5%;right: 48.7%;
  font-size: .75rem;
  width: 9.0625rem;
  justify-content: space-between;
}
.ear{
    z-index: 3;
    position:absolute;
    top: 37.5%;right: 42.7%;
    font-size: .75rem;
    width: 1.875rem;
    height: 1.875rem;
}
.leftear{
  display: block;
}
.rightear{
  display: block;
  margin-top: .5rem;
}
.score{
  display: flex;
  width: 12.5rem;
  justify-content: space-between;
}
.resport1{
   z-index: 3;
   position:absolute;
   top: 44.8%;right: 43.7%;
   font-size: .8125rem;
}
.assess{
  width: 11.25rem;
  display: flex;
  justify-content:space-between;
}
.resport2{
  z-index: 3;
  position:absolute;
  top: 55.2%;right: 44%;
  font-size: .8125rem;
}
.allassesss{
  display: flex;
  width: 11.25rem;
  justify-content: space-between;
}
.showreport{
    z-index: 3;
    position:absolute;
    top: 68.5%;right: 44%;
    font-size: .8125rem;
}
/* 按钮 */
.btn{
    color: rgba(16, 16, 16, 1);
    font-size: .875rem;
    text-align: center;
    border: .0625rem solid rgba(187, 187, 187, 1);
    background-color: rgba(124, 0, 0, 1);
    width: 8.125rem;
    height: 2.1875rem;
    color: rgba(255, 255, 255, 1);
}
.btnCountainer{
    width: 100%;
    text-align: center;
    margin-top: 2.5rem;
}
.return {
  font-size: 1.125rem;
  text-align: center;
  position: relative;
  left: 27.5rem;
  border: 0rem;
  background: #fff;
}
</style>